import React, { useEffect, useState, useRef } from 'react';
import TableDataBlock from '@/components/TableDataBlock';
import PopImgShow from '@/components/PopImgShow';
import { connect } from 'umi';
import { Space, Modal } from 'antd'
import Indentation from '@/components/Indentation';
import ImagePreviewGroup from '@/components/DescriptionsCondition/ImagePreviewGroup';
const UserAdminActivityLog = (props) => {
  const { visible = false, onClose, dispatch, loading, list, hideFlag, showHide } = props;
  const { show = false, detail = {} } = visible;
  const { id } = detail
  const searchItems = [
    {
      label: '操作时间',
      type: 'rangePicker',
      name: 'startDate',
      end: 'endDate',
    },
  ];
  const hideFetch = (hideFlag, o) => {
    dispatch({
      type: 'weCom/fakeUserAdminActivityLogHideFlag',
      payload: {
        hideFlag: hideFlag,
        id: o
      },
      callback: (e, total) => {
        handleCallback()
      },
    });
  }
  const handleCallback = () => {
    childRef.current.fetchGetData();
  };
  const getColumns = [
    {
      title: '操作 ',
      dataIndex: 'content',
      render: (e) => {
        return <Indentation width={120} str={e}></Indentation>
      }
    },
    {
      title: '操作类型',
      dataIndex: 'logType',
      render: (e) => {
        return {
          edit: '编辑客户信息',
          followUp: '跟进'
        }[e]
      }
    },

    {
      title: '跟进图片',
      dataIndex: 'images',
      render: (e) => {
        return <ImagePreviewGroup url={e}></ImagePreviewGroup>
      }
    },
    {
      title: '操作员工',
      dataIndex: 'organizationAdminName',
    },
    {
      title: '操作时间',
      dataIndex: 'createTime',
    },
    {
      type: 'handle',
      width: 200,
      show: hideFlag !== '0',
      dataIndex: 'id',
      render: (val, record) => [
        {
          title: '显示',
          visible: record.hideFlag === '1' && hideFlag !== '0',
          click: () => {
            const { hideFlag, id } = record
            hideFetch('0', id)
          },
        },
        {
          title: '隐藏',
          visible: record.hideFlag !== '1' && hideFlag !== '0',
          click: () => {
            const { hideFlag, id } = record
            hideFetch('1', id)
          },
        },
      ],
    },
  ].filter(val => {
    const { show = true } = val
    return show
  });
  const modalProps = {
    title: `员工轨迹`,
    width: 1200,
    visible: show,
    maskClosable: true,
    destroyOnClose: true,
    loading: loading,
    zIndex: 1001,
  };
  const childRef = useRef();
  return (
    <Modal {...modalProps} onCancel={onClose}>
      <TableDataBlock
        params={{ organizationUserId: id, dateType: 'month', hideFlag }}
        cRef={childRef}
        loading={loading}
        columns={getColumns}
        // searchItems={searchItems}
        rowKey={(record) => `${record.id}`}
        dispatchType={'subscriber/fetchUserAdminActivityLog'}
        {...list}
      ></TableDataBlock>
    </Modal >

  );
};
export default connect(({ subscriber, loading }) => ({
  list: subscriber.userAdminActivityLogList,
  loading: loading.effects['subscriber/fetchUserThirdTrace'],
}))(UserAdminActivityLog);
